<template>  
    <div>  
      <div v-for="(node, index) in treeData" :key="index">  
        <p v-if="node.type === 'paragraph'">  
          <!-- 递归调用自身来处理children -->  
          <tree-node v-if="node.children && node.children.length > 0" :tree-data="node.children" />  
          {{ node.children ? node.children[0].text : '' }}  
        </p>  
      </div>  
    </div>  
  </template>  
    
  <script>  
  export default {  
    name: 'TreeNode',  
    props: {  
      treeData: {  
        type: Array,  
        required: true,  
      },  
    },  
    components: {  
      TreeNode: () => import('./view.vue'), // 递归引用自身  
    },  
  };  
  </script>